
<template>
  <div class="createPost-container">
    <el-form label-width="10px" class="form-container" :model="postForm" :rules="rules" ref="postForm">
      <div class="createPost-main-container">
        <el-row>
          <el-col>
            <div class="postInfo-container">
              <el-row>
                <el-col :span="12">
                  <el-form-item prop="companyName">
                    <MDinput name="companyName" title="设备id" v-model="postForm.deviceCode" required :maxlength="16">
                      设备id
                    </MDinput>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item prop="usePlace">
                    <MDinput name="usePlace" title="工艺流程" v-model="postForm.processStages" required :maxlength="16">
                      工艺流程
                    </MDinput>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item prop="category">
                    <MDinput name="category" title="工作压力" v-model="postForm.workPressure" required :maxlength="16">
                      工作压力
                    </MDinput>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <el-form-item prop="specification">
                    <MDinput name="specification" title="工作温度" v-model="postForm.workTemperature" required :maxlength="16">
                      工作温度
                    </MDinput>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item prop="contact">
                    <MDinput name="contact" title="工作介质" v-model="postForm.workMedium" required :maxlength="16">
                      工作介质
                    </MDinput>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item prop="contactPhone">
                    <MDinput name="contactPhone" title="时间" v-model="postForm.time" required :maxlength="16">
                      时间
                    </MDinput>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item prop="riskValue">
                    <MDinput name="riskValue" title="实时温度" v-model="postForm.realTimeTemperature" required :maxlength="16">
                      实时温度
                    </MDinput>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item prop="materialLevel">
                    <MDinput name="materialLevel" title="料位" v-model="postForm.materialLevel" required :maxlength="16">
                      料位
                    </MDinput>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
          </el-col>
            <el-button @click="createDevice">添加</el-button>
        </el-row>
      </div>
    </el-form>
  </div>

</template>
<script>
  import { req } from '@/api/base/BaseApi'
  import MDinput from '@/components/MDinput'
  import Multiselect from 'vue-multiselect' // 使用的一个多选框组件，element-ui的select不能满足所有需求
  import 'vue-multiselect/dist/vue-multiselect.min.css' // 多选框组件css
  const defaultForm = {
          deviceCode:undefined,
          workPressure:undefined,
          workTemperature:undefined,
          workMedium:undefined,
          processStages:undefined,
          time:undefined,
          realTimeTemperature:undefined,
          materialLevel:undefined,
  }
  export default {
        name: "addDevice",
    components: {MDinput, Multiselect},
    data(){
          return {
            testlist: [],
            postForm: Object.assign({},defaultForm),
          }
      },
    mounted:function(){
      this.postForm = Object.assign({}, defaultForm)
    },
      methods: {
        createDevice(){
          req('/coketower-service/manufactureData', 'PUT', this.postForm).then(response => {
          }).catch(() => console.log('page request error'))
          this.$message('添加成功！')
        }
      }
    }
</script>

  <style rel="stylesheet/scss" lang="scss" scoped>
    @import "../../../../styles/mixin.scss";

    .createPost-container {
      position: relative;

      .createPost-main-container {
        padding: 40px 45px 20px 50px;

        .postInfo-container {
          position: relative;
          @include clearfix;
          margin-bottom: 10px;

          .postInfo-container-item {
            float: left;
          }
        }

        .editor-container {
          min-height: 500px;
          margin: 0 0 30px;

          .editor-upload-btn-container {
            text-align: right;
            margin-right: 10px;

            .editor-upload-btn {
              display: inline-block;
            }
          }
        }
      }

      .word-counter {
        width: 40px;
        position: absolute;
        right: -10px;
        top: 0px;
      }
    }
  </style>





